<template>
  <div>
    <div v-for="(d,i) in RECIPIENT_TYPE" :key="i" class="block">
      <div class="title">{{ d.dictName }}</div>
      <div class="checkbox">
        <el-checkbox v-for="item in d.children || []" :key="item.dictCode" :value="value" :label="item.dictCode" @input="handleInput">{{ item.dictName }}</el-checkbox>
      </div>
    </div>
  </div>
</template>
<script>
import { ccDict, getDataDictByParentId } from '@/api/dataDict'
export default {
  name: 'Post',
  props: {
    value: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      RECIPIENT_TYPE: []
    }
  },
  created() {
    this.getDictData()
  },
  methods: {
    getDictData() {
      ccDict('RECIPIENT_TYPE').then(async res => {
        const allPromise = {}
        for (const item of res.data) {
          allPromise[item.dictCode] = getDataDictByParentId(item.dictId).then(res => {
            item.children = res.data
            return res
          })
        }
        await Promise.all(Object.values(allPromise))
        this.RECIPIENT_TYPE = res.data
      })
    },
    handleInput(v) {
      this.$emit('input', v)
    }
  }
}
</script>
<style lang="scss">
.block{
  .title{
    color: #333;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
  }
  .checkbox{
    padding: 10px;
  }
}
</style>
